<script setup lang="ts">
import { ref } from 'vue';

import { useVbenModal } from '@vben/common-ui';

import { useFs } from '@fast-crud/fast-crud';

import { createCrudOptions } from '../data/tokenListCrud';

defineOptions({
  name: 'Token列表',
  inheritAttrs: false,
});

const emit = defineEmits<Emits>();

interface Emits {
  (e: 'success'): void;
}

const sessionId = ref<string>('');
const { crudRef, crudBinding, crudExpose } = useFs({
  createCrudOptions,
  context: { sessionId },
});

const [Modal, modalApi] = useVbenModal({
  async onOpenChange(isOpen) {
    if (isOpen) {
      sessionId.value = modalApi.getData()?.sessionId;
      crudExpose.doRefresh();
    }
  },
  onConfirm() {
    emit('success');
    modalApi.close();
  },
});
defineExpose(modalApi);
</script>

<template>
  <Modal title="Token详情" class="h-[70%] w-[70%]">
    <FsPage class="p-6">
      <FsCrud ref="crudRef" v-bind="crudBinding" />
    </FsPage>
  </Modal>
</template>
